html, body {
  padding: 0;
  margin: 0; }

body, .main {
  box-sizing: border-box;
  min-height: 100vh; }

html {
  font-size: 62.5%;
  color: #474a54;
  background: #232323;
  height: 100vh; }

@media (max-width: 700px) {
  .sidebar, header > form {
    display: none; }

  .sidebar h6 {
    font-size: 1.4em; }

  .sidebar a {
    padding: 10px 0; }

  body .main {
    margin: 45px 0 0 0; } }
body {
  font-size: 1.6rem;
  line-height: 1.6;
  font-weight: 400;
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  background: #fcfcfc; }
  body.nav-open {
    overflow: hidden; }
    body.nav-open .sidebar,
    body.nav-open header > form {
      display: block; }
    body.nav-open header {
      bottom: 0; }

table {
  border: 1px solid #E1E1E1;
  margin: 0 0 20px 0;
  border-collapse: collapse; }

th, td {
  border: 1px solid #ccc;
  padding: 10px;
  font-size: .9em;
  text-align: left; }

th {
  background: #f7f7f7; }

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  font-weight: 300; }

h1 {
  font-size: 4.0rem;
  line-height: 1.2;
  letter-spacing: 0rem; }

h2 {
  font-size: 3.6rem;
  line-height: 1.25;
  letter-spacing: 0rem; }

h3 {
  font-size: 3.0rem;
  line-height: 1.3;
  letter-spacing: 0rem;
  font-weight: 900; }

h4 {
  font-size: 2.4rem;
  line-height: 1.35;
  letter-spacing: 0rem;
  margin: 0 0 5px 0; }

h5 {
  font-size: 1.8rem;
  line-height: 1.5;
  letter-spacing: 0rem;
  margin-bottom: 4px;
  font-weight: bold;
  font-weight: 500; }

p {
  margin-top: 0; }

h3 a {
  text-decoration: none;
  color: #474a54; }

h3 a:hover {
  text-decoration: none;
  color: #474a54; }

a {
  color: #4BA2F2;
  text-decoration: none;
  transition: 0.3s all ease-in-out; }

a:hover, a:focus {
  color: #1A5099;
  text-decoration: underline; }

pre {
  white-space: pre-wrap;
  font-size: 1em;
  margin: 22px 0;
  word-wrap: break-word; }

dl {
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
  padding: 0 0 20px 0;
  margin: 0 0 20px 0; }

dl dt {
  width: 30%;
  float: left;
  font-weight: bold;
  position: relative;
  top: 20px; }

dl dd {
  margin-left: 30%;
  padding-left: 15px;
  margin-top: 20px; }

dl dd + dd {
  margin-top: 0; }

dl dd:after {
  visibility: hidden;
  display: block;
  content: "";
  clear: both;
  height: 0; }

.sidebar h6 {
  text-transform: uppercase;
  line-height: 1em;
  font-size: 1.5rem;
  letter-spacing: 1px;
  font-weight: 900;
  color: #474a54; }

.sidebar {
  padding: 20px 20px 0 20px;
  white-space: nowrap;
  overflow-y: auto; }
  .sidebar section {
    padding: 10px 0; }
  .sidebar ul {
    padding: 0 0 0 10px;
    margin: 0;
    list-style: none; }
  .sidebar h6 {
    padding: 0;
    margin: 0 0 5px 0; }
  .sidebar a {
    color: #364149;
    text-decoration: none;
    font-size: .90em;
    display: block;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    padding: 2px 0;
    transition: 0.3s color ease-in-out; }
    .sidebar a.active {
      color: #2196F3;
      text-decoration: none; }
  .sidebar a:hover, .sidebar a:focus {
    color: #2196F3; }

.endpoint {
  font-size: 10px;
  padding: 0 2px;
  position: relative; }

h3 .endpoint {
  padding: 4px 6px;
  font-size: 19px; }

.endpoint.put {
  color: #7E57C2; }
  .endpoint.put:after {
    content: "PUT"; }

.endpoint.delete {
  color: #FF7043; }
  .endpoint.delete:after {
    content: "DELETE"; }

.endpoint.get {
  color: #66BB6A; }
  .endpoint.get:after {
    content: "GET"; }

.endpoint.post {
  color: #42A5F5; }
  .endpoint.post:after {
    content: "POST"; }

.main {
  margin: 0 0 0 210px;
  border-left: 1px solid #eee; }
  .main h6 {
    font-size: 1.01em;
    padding: 0 0 6px 0;
    margin: 0; }
  .main .description {
    color: #aaa;
    margin-top: -11px; }
  .main .overview {
    color: #aaa;
    background: #fefefe; }
  @media (max-width: 700px) {
    .main {
      margin: 0; } }

hr {
  border: 0;
  border-top: 1px solid #ddd;
  margin: 20px 0; }

.error, .warning, .info, .success {
  border-left: 5px solid #FD0;
  padding: 10px 15px;
  margin-left: -20px;
  margin-right: -15px;
  background-color: #FAFAFA;
  border-radius: 2px; }

.info {
  border-color: #56ADEC; }

.error {
  border-color: #F20; }

.success {
  border-color: #6c0; }

.doc-content {
  width: 100%;
  border: 0;
  -moz-border-image: -moz-linear-gradient(left, #eee 0%, #eee 50%, #333333 50%);
  -webkit-border-image: -webkit-linear-gradient(left, #eee 0%, #eee 50%, #333333 50%);
  border-image-slice: 1;
  padding: 30px 0;
  background: -webkit-linear-gradient(left, #ffffff 0%, #ffffff 50%, #27313E 50%);
  /* Chrome10+,Safari5.1+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#232323',GradientType=1 );
  /* IE6-9 */ }

.doc-content:after {
  visibility: hidden;
  display: block;
  content: "";
  clear: both;
  height: 0; }

.doc-content:last-child {
  border: 0; }

.left-docs {
  width: 50%;
  float: left;
  padding: 0 50px;
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  /* Opera/IE 8+ */ }
  .left-docs pre {
    border: 0px;
    box-shadow: 0 0 0 1px #eee;
    border-radius: 3px;
    padding: 10px; }

.right-code {
  width: 50%;
  float: left;
  padding: 0 50px;
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  /* Opera/IE 8+ */ }
  .right-code code {
    color: whitesmoke; }
  .right-code pre {
    background: white;
    background: #3E4956;
    padding: 10px;
    border-radius: 5px; }
  .right-code .code-viewer .languages li a:hover {
    border-color: #555; }
  .right-code p {
    color: white; }

.code-viewer .languages {
  padding: 0;
  margin: 0 0 5px 0;
  list-style: none;
  font-size: .9em; }
  .code-viewer .languages li {
    display: inline-block; }
    .code-viewer .languages li a {
      display: block;
      padding: 5px 10px;
      z-index: 100;
      border: 1px solid transparent; }
      .code-viewer .languages li a:hover {
        border-color: #eee;
        border-radius: 5px; }
      .code-viewer .languages li a.active:hover {
        border-color: transparent; }
.code-viewer a {
  text-decoration: none;
  color: #aaa; }
  .code-viewer a:hover {
    color: #222; }
.code-viewer pre {
  margin: 0 0 20px 0; }

.code-viewer a.active, .code-viewer a.active:hover, .right-code .code-viewer a.active:hover {
  color: #4BA2EE; }

.right-code .code-viewer a:hover {
  color: #fff; }

@media (max-width: 700px) {
  .main {
    border-left: none; } }
@media (max-width: 1000px) {
  .right-code {
    float: none;
    width: 100%;
    background: white;
    background: #232323;
    padding: 30px 30px 10px; }

  .left-docs {
    float: none;
    width: 100%;
    padding: 0 24px; }

  .doc-content {
    background: #fff;
    padding-bottom: 0;
    border-image: none;
    -moz-border-image: none;
    -webkit-border-image: none;
    border-color: #eee; } }
header {
  max-height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  overflow-x: hidden;
  z-index: 1;
  background-color: #f5f5f5;
  border-top: 4px solid #2196F3; }
  header h1 {
    height: 107px;
    box-sizing: border-box;
    background-color: #3E4956;
    margin: 0;
    font-size: 1.7rem;
    line-height: 0.8;
    letter-spacing: 0;
    font-weight: 600;
    text-indent: 0;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    align-items: center;
    border-bottom: 1px solid rgba(0, 0, 0, 0.075); }
    header h1 img {
      height: 36px;
      margin: 0 18px; }
  header .open-nav {
    background-image: url(/images/menu.svg);
    background-color: transparent;
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: center;
    padding-right: 0px;
    border: 0;
    border-radius: 2px;
    cursor: pointer;
    height: 60px;
    width: 60px; }
    header .open-nav:focus {
      outline: none;
      background-color: rgba(0, 0, 0, 0.05); }
    header .open-nav:hover {
      background-color: rgba(0, 0, 0, 0.1); }
  @media (min-width: 700px) {
    header {
      background-color: transparent;
      width: 210px;
      right: auto;
      bottom: auto; }
      header .open-nav {
        display: none; }
      header h1 {
        box-shadow: inset -10px 0 10px -10px rgba(0, 0, 0, 0.1); } }

#search-input {
  -webkit-appearance: none;
  display: block;
  margin: 0;
  padding: 10px 20px;
  width: 100%;
  box-sizing: border-box;
  border: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.075);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.8; }
  #search-input:focus {
    outline: none;
    border-left: 5px solid #4BA2F2;
    padding-left: 15px; }

.search-page {
  max-width: 800px;
  margin: 0 0 0 50px;
  padding: 50px 20px 0 20px; }

#search-results {
  margin: 0;
  padding: 0; }
  #search-results li {
    list-style: none;
    margin: 0;
    padding: 0; }
    #search-results li h4 {
      font-size: 2rem; }
    #search-results li p {
      line-height: 1.5; }

.copyright {
  text-align: center;
  font-size: .6em;
  margin: 30px 0 0 0; }

.logo-link {
  color: #ffffff;
  font-weight: 600;
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
  pointer-events: none;
  cursor: default; }

.glossary dt {
  top: 0px; }

code .hll {
  background-color: #ffffcc; }

code .c {
  color: #aaaaaa;
  font-style: italic; }

/* Comment */
code .err {
  color: #F00000;
  background-color: #F0A0A0; }

/* Error */
code .k {
  color: #0000aa; }

/* Keyword */
code .cm {
  color: #aaaaaa;
  font-style: italic; }

/* Comment.Multiline */
code .cp {
  color: #4c8317; }

/* Comment.Preproc */
code .c1 {
  color: #aaaaaa;
  font-style: italic; }

/* Comment.Single */
code .cs {
  color: #0000aa;
  font-style: italic; }

/* Comment.Special */
code .gd {
  color: #aa0000; }

/* Generic.Deleted */
code .ge {
  font-style: italic; }

/* Generic.Emph */
code .gr {
  color: #aa0000; }

/* Generic.Error */
code .gh {
  color: #000080;
  font-weight: bold; }

/* Generic.Heading */
code .gi {
  color: #00aa00; }

/* Generic.Inserted */
code .go {
  color: #888888; }

/* Generic.Output */
code .gp {
  color: #555555; }

/* Generic.Prompt */
code .gs {
  font-weight: bold; }

/* Generic.Strong */
code .gu {
  color: #800080;
  font-weight: bold; }

/* Generic.Subheading */
code .gt {
  color: #aa0000; }

/* Generic.Traceback */
code .kc {
  color: #0000aa; }

/* Keyword.Constant */
code .kd {
  color: #0000aa; }

/* Keyword.Declaration */
code .kn {
  color: #0000aa; }

/* Keyword.Namespace */
code .kp {
  color: #0000aa; }

/* Keyword.Pseudo */
code .kr {
  color: #0000aa; }

/* Keyword.Reserved */
code .kt {
  color: #00aaaa; }

/* Keyword.Type */
code .m {
  color: #009999; }

/* Literal.Number */
code .s {
  color: #aa5500; }

/* Literal.String */
code .na {
  color: #1e90ff; }

/* Name.Attribute */
code .nb {
  color: #00aaaa; }

/* Name.Builtin */
code .nc {
  color: #00aa00;
  text-decoration: underline; }

/* Name.Class */
code .no {
  color: #aa0000; }

/* Name.Constant */
code .nd {
  color: #888888; }

/* Name.Decorator */
code .ni {
  color: #800000;
  font-weight: bold; }

/* Name.Entity */
code .nf {
  color: #00aa00; }

/* Name.Function */
code .nn {
  color: #00aaaa;
  text-decoration: underline; }

/* Name.Namespace */
code .nt {
  color: #1e90ff;
  font-weight: bold; }

/* Name.Tag */
code .nv {
  color: #aa0000; }

/* Name.Variable */
code .ow {
  color: #0000aa; }

/* Operator.Word */
code .w {
  color: #bbbbbb; }

/* Text.Whitespace */
code .mf {
  color: #009999; }

/* Literal.Number.Float */
code .mh {
  color: #009999; }

/* Literal.Number.Hex */
code .mi {
  color: #009999; }

/* Literal.Number.Integer */
code .mo {
  color: #009999; }

/* Literal.Number.Oct */
code .sb {
  color: #aa5500; }

/* Literal.String.Backtick */
code .sc {
  color: #aa5500; }

/* Literal.String.Char */
code .sd {
  color: #aa5500; }

/* Literal.String.Doc */
code .s2 {
  color: #aa5500; }

/* Literal.String.Double */
code .se {
  color: #aa5500; }

/* Literal.String.Escape */
code .sh {
  color: #aa5500; }

/* Literal.String.Heredoc */
code .si {
  color: #aa5500; }

/* Literal.String.Interpol */
code .sx {
  color: #aa5500; }

/* Literal.String.Other */
code .sr {
  color: #009999; }

/* Literal.String.Regex */
code .s1 {
  color: #aa5500; }

/* Literal.String.Single */
code .ss {
  color: #0000aa; }

/* Literal.String.Symbol */
code .bp {
  color: #00aaaa; }

/* Name.Builtin.Pseudo */
code .vc {
  color: #aa0000; }

/* Name.Variable.Class */
code .vg {
  color: #aa0000; }

/* Name.Variable.Global */
code .vi {
  color: #aa0000; }

/* Name.Variable.Instance */
code .il {
  color: #009999; }

/* Literal.Number.Integer.Long */
.right-code code .hll {
  background-color: #49483e; }

.right-code code .c {
  color: #75715e; }

/* Comment */
.right-code code .err {
  color: #960050;
  background-color: #1e0010; }

/* Error */
.right-code code .k {
  color: #66d9ef; }

/* Keyword */
.right-code code .l {
  color: #ae81ff; }

/* Literal */
.right-code code .n {
  color: #f8f8f2; }

/* Name */
.right-code code .o {
  color: #f92672; }

/* Operator */
.right-code code .p {
  color: #f8f8f2; }

/* Punctuation */
.right-code code .cm {
  color: #75715e; }

/* Comment.Multiline */
.right-code code .cp {
  color: #75715e; }

/* Comment.Preproc */
.right-code code .c1 {
  color: #75715e; }

/* Comment.Single */
.right-code code .cs {
  color: #75715e; }

/* Comment.Special */
.right-code code .ge {
  font-style: italic; }

/* Generic.Emph */
.right-code code .gs {
  font-weight: bold; }

/* Generic.Strong */
.right-code code .kc {
  color: #66d9ef; }

/* Keyword.Constant */
.right-code code .kd {
  color: #66d9ef; }

/* Keyword.Declaration */
.right-code code .kn {
  color: #f92672; }

/* Keyword.Namespace */
.right-code code .kp {
  color: #66d9ef; }

/* Keyword.Pseudo */
.right-code code .kr {
  color: #66d9ef; }

/* Keyword.Reserved */
.right-code code .kt {
  color: #66d9ef; }

/* Keyword.Type */
.right-code code .ld {
  color: #e6db74; }

/* Literal.Date */
.right-code code .m {
  color: #ae81ff; }

/* Literal.Number */
.right-code code .s {
  color: #e6db74; }

/* Literal.String */
.right-code code .na {
  color: #a6e22e; }

/* Name.Attribute */
.right-code code .nb {
  color: #f8f8f2; }

/* Name.Builtin */
.right-code code .nc {
  color: #a6e22e; }

/* Name.Class */
.right-code code .no {
  color: #66d9ef; }

/* Name.Constant */
.right-code code .nd {
  color: #a6e22e; }

/* Name.Decorator */
.right-code code .ni {
  color: #f8f8f2; }

/* Name.Entity */
.right-code code .ne {
  color: #a6e22e; }

/* Name.Exception */
.right-code code .nf {
  color: #a6e22e; }

/* Name.Function */
.right-code code .nl {
  color: #f8f8f2; }

/* Name.Label */
.right-code code .nn {
  color: #f8f8f2; }

/* Name.Namespace */
.right-code code .nx {
  color: #a6e22e; }

/* Name.Other */
.right-code code .py {
  color: #f8f8f2; }

/* Name.Property */
.right-code code .nt {
  color: #f92672; }

/* Name.Tag */
.right-code code .nv {
  color: #f8f8f2; }

/* Name.Variable */
.right-code code .ow {
  color: #f92672; }

/* Operator.Word */
.right-code code .w {
  color: #f8f8f2; }

/* Text.Whitespace */
.right-code code .mf {
  color: #ae81ff; }

/* Literal.Number.Float */
.right-code code .mh {
  color: #ae81ff; }

/* Literal.Number.Hex */
.right-code code .mi {
  color: #ae81ff; }

/* Literal.Number.Integer */
.right-code code .mo {
  color: #ae81ff; }

/* Literal.Number.Oct */
.right-code code .sb {
  color: #e6db74; }

/* Literal.String.Backtick */
.right-code code .sc {
  color: #e6db74; }

/* Literal.String.Char */
.right-code code .sd {
  color: #e6db74; }

/* Literal.String.Doc */
.right-code code .s2 {
  color: #e6db74; }

/* Literal.String.Double */
.right-code code .se {
  color: #ae81ff; }

/* Literal.String.Escape */
.right-code code .sh {
  color: #e6db74; }

/* Literal.String.Heredoc */
.right-code code .si {
  color: #e6db74; }

/* Literal.String.Interpol */
.right-code code .sx {
  color: #e6db74; }

/* Literal.String.Other */
.right-code code .sr {
  color: #e6db74; }

/* Literal.String.Regex */
.right-code code .s1 {
  color: #e6db74; }

/* Literal.String.Single */
.right-code code .ss {
  color: #e6db74; }

/* Literal.String.Symbol */
.right-code code .bp {
  color: #f8f8f2; }

/* Name.Builtin.Pseudo */
.right-code code .vc {
  color: #f8f8f2; }

/* Name.Variable.Class */
.right-code code .vg {
  color: #f8f8f2; }

/* Name.Variable.Global */
.right-code code .vi {
  color: #f8f8f2; }

/* Name.Variable.Instance */
.right-code code .il {
  color: #ae81ff; }

/* Literal.Number.Integer.Long */
/* Generic Heading & Diff Header */
.right-code code .gu {
  color: #75715e; }

/* Generic.Subheading & Diff Unified/Comment? */
.right-code code .gd {
  color: #f92672; }

/* Generic.Deleted & Diff Deleted */
.right-code code .gi {
  color: #a6e22e; }

/* Generic.Inserted & Diff Inserted */
.highlight {
  padding: 5px;
  background: #23323E; }

pre {
  color: white; }

.row {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px; }

.right-code {
  margin-top: 110px; }

.left-docs {
  border-top: 1px solid #eeeeee; }
  .left-docs h3:first-child {
    padding-top: 40px; }

.left-docs img {
  max-width: 100%; }

section.doc-content.introductionwelcome > .left-docs {
  border-top: none !important; }

.main:focus, .doc-content:focus {
  outline: none; }

/*.hero {
    text-align: left;
    padding: 0 50px;
    height: 110px;
    border-bottom: 1px solid #eee;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    &__img {

    }
    &__h1 {
      margin-bottom: 0;
    }
}*/
header h1 {
  height: 60px; }

.hero {
  padding: 50px 24px 40px;
  border-bottom: 1px solid #eee; }
  .hero__img {
    display: block;
    max-width: 100%; }
  .hero__h1 {
    font-size: 2em; }

@media (min-width: 700px) {
  .hero {
    padding: 0px 50px;
    height: 63px;
    display: flex;
    align-items: center; }
    .hero__img {
      display: none; }
    .hero__h1 {
      margin-bottom: 0; } }
@media (min-width: 1000px) {
  .hero {
    text-align: left;
    padding: 0 50px;
    height: 111px;
    position: relative;
    justify-content: space-between; }
    .hero__img {
      display: block;
      max-width: 100%; }

  header h1 {
    height: 107px; } }
.footer {
  background-color: #3E4956;
  border-top: 1px solid #eeeeee;
  display: flex;
  justify-content: center;
  padding: 10px; }
  .footer a:hover,
  .footer a:visited {
    color: #4BA2F2; }

.main-nav-section .title {
  cursor: pointer;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s; }
.main-nav-section.show-content .content {
  display: block; }
.main-nav-section .content {
  display: none;
  overflow: hidden; }

.active, .accordion:hover {
  /*background-color: #ccc;*/ }

.top-of-tutorial-repo-link {
  text-transform: lowercase; }
  .top-of-tutorial-repo-link .first-word {
    text-transform: capitalize; }
